<template>
  <Dialog v-model="dialogVisible" title="异议详情" width="800px">
    <el-descriptions :column="2" border>
      <el-descriptions-item label="申请人姓名">
        {{ objectionData.applicantName || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="身份证号">
        {{ objectionData.idCard || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="联系电话">
        {{ objectionData.phone || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="异议类型">
        <el-tag>{{ getTypeName(objectionData.objectionType) }}</el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="申请时间">
        {{ objectionData.applicationTime || '-' }}
      </el-descriptions-item>
      <el-descriptions-item label="处理状态">
        <el-tag :type="getStatusColor(objectionData.status)">
          {{ getStatusName(objectionData.status) }}
        </el-tag>
      </el-descriptions-item>
      <el-descriptions-item label="异议内容" :span="2">
        <div style="white-space: pre-wrap; max-height: 200px; overflow-y: auto;">
          {{ objectionData.objectionContent || '-' }}
        </div>
      </el-descriptions-item>
      <el-descriptions-item label="处理时间" v-if="objectionData.handleTime">
        {{ objectionData.handleTime }}
      </el-descriptions-item>
      <el-descriptions-item label="处理结果" v-if="objectionData.handleResult" :span="2">
        <div style="white-space: pre-wrap;">
          {{ objectionData.handleResult }}
        </div>
      </el-descriptions-item>
    </el-descriptions>
    
    <template #footer>
      <el-button @click="dialogVisible = false">关闭</el-button>
    </template>
  </Dialog>
</template>

<script setup lang="ts">
import { ref } from 'vue'

const dialogVisible = ref(false)
const objectionData = ref({} as any)

const getTypeName = (type: number) => {
  const typeMap = { 1: '成绩异议', 2: '流程异议', 3: '其他异议' }
  return typeMap[type] || '-'
}

const getStatusName = (status: number) => {
  const statusMap = { 0: '待处理', 1: '处理中', 2: '已处理', 3: '已拒绝' }
  return statusMap[status] || '-'
}

const getStatusColor = (status: number) => {
  const colorMap = { 0: 'warning', 1: 'primary', 2: 'success', 3: 'danger' }
  return colorMap[status] || 'info'
}

const open = (data: any) => {
  dialogVisible.value = true
  objectionData.value = data
}

defineExpose({ open })
</script> 